/*
 * @Description: 退出登录弹窗
 * @Author: ziwei.ma
 * @Date: 2019-10-25 14:11:10
 * @Last Modified by: ziwei.ma
 * @Last Modified time: 2019-10-29 10:35:15
 */
<template>
  <mask-module
    ref="mask"
    :isClickBgToHide="false"
  >
    <div class="title_wrapper flex-v flex-vc">
      <div class="text_wrapper flex-v flex-vc">
        <div class="title fontsize40">提示</div>
        <span class="fontsize28">退出登录后，您将无法使用相关功能。</span>
      </div>
      <div class="btn_wrapper flex-h flex-hsb">
        <div
          class="logout"
          @click="onConfirm"
        >确定退出</div>
        <div
          class="cancel baseColorNoAcitve"
          @click="onCancle"
        >再想想</div>
      </div>
    </div>
  </mask-module>
</template>
<script>
import AnimatedDialog from '@/components/animateddialog/AnimatedDialog'
import { wxLogin } from '../../utils/wxLogin.js'
export default {
  components: {
    'mask-module': AnimatedDialog
  },
  props: {
    ticketDetail: {
      type: Object,
      default: null
    }
  },
  computed: {
    mask() {
      return this.$refs.mask
    }
  },
  data() {
    return {
      textareaValue: ''
    }
  },
  methods: {
    onCancle() {
      this.mask.hide()
    },
    onConfirm() {
      localStorage.clear()
      this.$router.push({ name: 'loginIndex' })
      wxLogin(true)
      this.mask.hide()
    }
  }
}
</script>
<style scoped>
.title_wrapper {
  width: 686px;
  height: 264px;
  background: rgba(255, 255, 255, 1);
  border-radius: 16px;
  box-sizing: border-box;
}
.text_wrapper {
  width: 100%;
  padding: 32px;
  height: 176px;
  box-sizing: border-box;
}
.title {
  margin-bottom: 16px;
}
.btn_wrapper {
  height: 86px;
  line-height: 86px;
  text-align: center;
  width: 100%;
  border-top: 1px solid #999999; /*no*/
}
.btn_wrapper > div {
  font-size: 32px;
  font-weight: 400;
  width: 50%;
}
.logout {
  border-right: 1px solid #999999; /*no*/
}
</style>
